<template>
	<view class="success_page_container">
		<view class="success_page_box">
			<view class="success_img_box">
				<image :src="successIcon" mode="" class="success_img"></image>
			</view>
			<view class="success_title">
				您的订单已提交成功！
			</view>
			<view class="success_content">
				您的订单正在进行系统审核，在此期间您可以点击下方自助查询订单状态，审核结果将通过短信形式发送给您！
			</view>
			<view class="success_btn_box">
				<view class="query_detail_btn" @click="handlerQueryDetail">
					自助查询订单
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				successIcon: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66c980ffeee24_1724481791.png'
			}
		},
		methods: {
			handlerQueryDetail() {
				// uni.switchTab({
				// 	url: '/pages/order/order'
				// })
				uni.navigateTo({
					url: '/pages/shopHome/shopHome?current=' + 1
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.success_page_container {
		padding: 220rpx 80rpx 0;

		.success_page_box {
			display: flex;
			flex-direction: column;
			align-items: center;

			.success_img_box {
				width: 170rpx;
				height: 170rpx;

				.success_img {
					width: 100%;
					height: 100%;
				}
			}

			.success_title {
				font-weight: 700;
				font-size: 40rpx;
				padding: 60rpx 0;
			}

			.success_content {
				font-size: 28rpx;
				color: #919192;
				text-align: center;
				line-height: 48rpx;
			}

			.success_btn_box {
				padding-top: 80rpx;

				.query_detail_btn {
					width: 350rpx;
					height: 70rpx;
					background: #418bf8;
					color: #fff;
					font-weight: 550;
					text-align: center;
					line-height: 70rpx;
					border-radius: 12rpx;
				}
			}
		}
	}
</style>